<template>
	<div class="app-container">
		<div
			v-loading="buttonLoading"
			class="card-wrap flex-column justify-end card-padding">
			<div class="card-title-wrap">
				<span>上传合格证</span>
				<span></span>
			</div>

			<el-descriptions>
				<el-descriptions-item label="采购编号">
					{{ form.purchaseNo | filterNull }}
				</el-descriptions-item>
				<el-descriptions-item label="客户名称">
					{{ form.customerName | filterNull }}
				</el-descriptions-item>
			</el-descriptions>

			<el-form
				ref="form"
				:rules="rules"
				:model="form"
				label-width="80px"
				label-position="top">
				<el-row :gutter="130" style="margin-right: 3%">
					<el-col :span="24">
						<el-form-item
							label="上传合格证:"
							prop="qualifiedCardOss">
							<ImageCommon
								info="合格证"
								:limit="1"
								@input="imageChange"
								v-model="form.qualifiedCardOss"></ImageCommon>
							<!--                            <ImageUpload :limit="1" @input="imageChange" v-model="form.qualifiedCardOss"></ImageUpload>-->
						</el-form-item>
					</el-col>
					<!--车辆状态为整备中合格证列表中的合格证编码、发动机号、车架号为只读-->
					<el-col :span="8">
						<el-form-item label="合格证编码:" prop="qualifiedNo">
							<el-input
								maxlength="50"
								v-model="form.qualifiedNo"
								clearable
								:disabled="2 == form.businessType"
								placeholder="请输入合格证编码"></el-input>
						</el-form-item>
					</el-col>

					<el-col :span="8">
						<el-form-item label="车架号:" prop="vinNo">
							<el-input
								maxlength="17"
								v-model="form.vinNo"
                @input="value=>form.vinNo=value.replace(/[^A-HJ-NPR-Z0-9]/g, '')"
								clearable
								:disabled="2 == form.businessType"
								placeholder="请输入车架号"></el-input>
						</el-form-item>
					</el-col>

					<el-col :span="8">
						<el-form-item label="发动机号码:" prop="engineNo">
							<el-input
								maxlength="50"
								@input="
									value =>
										(form.engineNo = value.replace(
											/[^\w_]/g,
											'',
										))
								"
								:disabled="2 == form.businessType"
								v-model="form.engineNo"
								clearable
								placeholder="请输入发动机号码"></el-input>
						</el-form-item>
					</el-col>

					<el-col :span="8">
						<el-form-item label="发证日期:" prop="issuanceDate">
							<el-date-picker
								v-model="form.issuanceDate"
								type="datetime"
								placeholder="请选择"
								value-format="yyyy-MM-dd HH:mm:ss"
								style="width: 100%"></el-date-picker>
						</el-form-item>
					</el-col>

					<!--                    <el-col :span="8">-->
					<!--                        <el-form-item label="行驶证所有人:" prop="ownerName">-->
					<!--                            <el-input v-model="form.ownerName" clearable placeholder="请输入行驶证所有人"></el-input>-->
					<!--                        </el-form-item>-->
					<!--                    </el-col>-->

					<el-col :span="8">
						<el-form-item label="车辆种类:" prop="vehicleCategory">
							<el-input
								maxlength="50"
								v-model="form.vehicleCategory"
								clearable
								placeholder="请输入车辆种类"></el-input>
							<!--                            <el-select v-model="form.vehicleCategory" clearable style="width: 100%">-->
							<!--                                <template v-for="dict in dict.type.customer_label">-->
							<!--                                    <el-option :label="dict.label" :value="dict.value" :key="dict.value"></el-option>-->
							<!--                                </template>-->
							<!--                            </el-select>-->
						</el-form-item>
					</el-col>

<!--					<el-col :span="8">-->
<!--						<el-form-item label="车辆类型:" prop="carType">-->
<!--							<el-select-->
<!--								filterable-->
<!--								v-model="form.carType"-->
<!--								clearable-->
<!--								style="width: 100%">-->
<!--								<template v-for="dict in dict.type.car_type">-->
<!--									<el-option-->
<!--										:label="dict.label"-->
<!--										:value="dict.value"-->
<!--										:key="dict.value"></el-option>-->
<!--								</template>-->
<!--							</el-select>-->
<!--						</el-form-item>-->
<!--					</el-col>-->

					<el-col :span="8">
						<el-form-item label="车辆性质:" prop="carNature">
							<!--                            <el-input v-model="form.carNature" clearable placeholder="请输入车辆性质"></el-input>-->
							<el-select
								:disabled="2 == form.purchaseSource"
								filterable
								v-model="form.carNature"
								clearable
								style="width: 100%">
								<template v-for="dict in dict.type.car_nature">
									<el-option
										:label="dict.label"
										:value="dict.value"
										:key="dict.value"></el-option>
								</template>
							</el-select>
						</el-form-item>
					</el-col>

					<el-col :span="8">
						<el-form-item label="品牌车系:" prop="seriesId">
							<LinkageSelect2
								:disabled="2 == form.purchaseSource"
								v-model="form.modeldata"
								:key="modelKey"
								:check-strictly="false"
								style="width: 100%"
								@changeNode="linkageChange($event)" />
						</el-form-item>
					</el-col>

					<el-col :span="8">
						<el-form-item label="车型:" prop="modelId">
							<ModelSelect
								style="width: 100%"
								@sel="modeSel($event)"
								:disabled="2 == form.purchaseSource"
								:modelData="form" />
						</el-form-item>
					</el-col>

					<!--                    <el-col :span="16">-->
					<!--                        <el-form-item label="品牌车系车型:" prop="modelId">-->

					<!--                            <linkage-select-->
					<!--                                v-model="form.modeldata" :key="modelKey"-->
					<!--                                :check-strictly="false" style="width: 100%" @changeNode="linkageChange($event)"/>-->

					<!--                        </el-form-item>-->
					<!--                    </el-col>-->

					<!--                    <el-col :span="8">-->
					<!--                        <el-form-item label="车辆品牌:" prop="customerLabelCode">-->
					<!--                            <el-select v-model="form.customerLabelCode" clearable style="width: 100%">-->
					<!--                                <template v-for="dict in dict.type.customer_label">-->
					<!--                                    <el-option :label="dict.label" :value="dict.value" :key="dict.value"></el-option>-->
					<!--                                </template>-->
					<!--                            </el-select>-->
					<!--                        </el-form-item>-->
					<!--                    </el-col>-->

					<!--                    <el-col :span="8">-->
					<!--                        <el-form-item label="车系:" prop="customerLabelCode">-->
					<!--                            <el-select v-model="form.customerLabelCode" clearable style="width: 100%">-->
					<!--                                <template v-for="dict in dict.type.customer_label">-->
					<!--                                    <el-option :label="dict.label" :value="dict.value" :key="dict.value"></el-option>-->
					<!--                                </template>-->
					<!--                            </el-select>-->
					<!--                        </el-form-item>-->
					<!--                    </el-col>-->

					<!--                    <el-col :span="8">-->
					<!--                        <el-form-item label="年款:" prop="styleYear">-->
					<!--                            <el-input maxlength="50" v-model="form.styleYear" clearable placeholder="请输入年款"></el-input>-->
					<!--&lt;!&ndash;                            <el-select v-model="form.styleYear" clearable style="width: 100%">&ndash;&gt;-->
					<!--&lt;!&ndash;                                <template v-for="dict in dict.type.customer_label">&ndash;&gt;-->
					<!--&lt;!&ndash;                                    <el-option :label="dict.label" :value="dict.value" :key="dict.value"></el-option>&ndash;&gt;-->
					<!--&lt;!&ndash;                                </template>&ndash;&gt;-->
					<!--&lt;!&ndash;                            </el-select>&ndash;&gt;-->
					<!--                        </el-form-item>-->
					<!--                    </el-col>-->

					<!--                    <el-col :span="8">-->
					<!--                        <el-form-item label="车型:" prop="customerLabelCode">-->
					<!--                            <el-select v-model="form.customerLabelCode" clearable style="width: 100%">-->
					<!--                                <template v-for="dict in dict.type.customer_label">-->
					<!--                                    <el-option :label="dict.label" :value="dict.value" :key="dict.value"></el-option>-->
					<!--                                </template>-->
					<!--                            </el-select>-->
					<!--                        </el-form-item>-->
					<!--                    </el-col>-->

					<!--                    <el-col :span="8">-->
					<!--                        <el-form-item label="配置:" prop="config">-->
					<!--                            <el-input maxlength="50" v-model="form.config" clearable placeholder="请输入配置"></el-input>-->
					<!--&lt;!&ndash;                            <el-select v-model="form.config" clearable style="width: 100%">&ndash;&gt;-->
					<!--&lt;!&ndash;                                <template v-for="dict in dict.type.customer_label">&ndash;&gt;-->
					<!--&lt;!&ndash;                                    <el-option :label="dict.label" :value="dict.value" :key="dict.value"></el-option>&ndash;&gt;-->
					<!--&lt;!&ndash;                                </template>&ndash;&gt;-->
					<!--&lt;!&ndash;                            </el-select>&ndash;&gt;-->
					<!--                        </el-form-item>-->
					<!--                    </el-col>-->

					<el-col :span="8">
						<el-form-item label="档位:" prop="gearPosition">
							<el-input
								maxlength="50"
								v-model="form.gearPosition"
								clearable
								:disabled="2 == form.purchaseSource"
								placeholder="请输入档位"></el-input>
						</el-form-item>
					</el-col>

					<el-col :span="8">
						<el-form-item label="座位数:" prop="seatNum">
							<el-input
								maxlength="50"
								v-model="form.seatNum"
								clearable
								:disabled="2 == form.purchaseSource"
								placeholder="请输入座位数"></el-input>
						</el-form-item>
					</el-col>

					<el-col :span="8">
						<el-form-item label="燃油类型:" prop="fuelType">
							<el-select
								filterable
								v-model="form.fuelType"
								clearable
								:disabled="2 == form.purchaseSource"
								style="width: 100%">
								<template v-for="dict in dict.type.fuel_type">
									<el-option
										:label="dict.label"
										:value="dict.value"
										:key="dict.value"></el-option>
								</template>
							</el-select>
						</el-form-item>
					</el-col>

					<el-col :span="8">
						<el-form-item label="排量:" prop="liter">
							<el-input
								maxlength="50"
								v-model="form.liter"
								clearable
								placeholder="请输入排量"
								:disabled="2 == form.purchaseSource"></el-input>
						</el-form-item>
					</el-col>

					<el-col :span="8">
						<el-form-item
							label="环保标准:"
							prop="environmentalStandards">
							<el-input
								maxlength="50"
								v-model="form.environmentalStandards"
								clearable
								:disabled="2 == form.purchaseSource"
								placeholder="请输入环保标准"></el-input>
						</el-form-item>
					</el-col>

					<el-col :span="8">
						<el-form-item label="外观颜色:" prop="exteriorColor">
							<el-input
								maxlength="50"
								v-model="form.exteriorColor"
								clearable
								placeholder="请输入外观颜色"></el-input>
						</el-form-item>
					</el-col>

					<el-col :span="8">
						<el-form-item label="内饰颜色:" prop="interiorColor">
							<el-input
								maxlength="50"
								v-model="form.interiorColor"
								clearable
								placeholder="请输入内饰颜色"></el-input>
						</el-form-item>
					</el-col>

					<el-col :span="8">
						<el-form-item label="车辆级别:" prop="carLevel">
							<el-input
								maxlength="50"
								v-model="form.carLevel"
								clearable
								placeholder="请输入车辆级别"></el-input>
						</el-form-item>
					</el-col>

					<el-col :span="8">
						<el-form-item
							label="车辆随车物品:"
							prop="carAccompanying">
							<el-input
								maxlength="50"
								v-model="form.carAccompanying"
								clearable
								placeholder="请输入车辆随车物品"></el-input>
						</el-form-item>
					</el-col>

					<el-col :span="8">
						<el-form-item label="备用钥匙数量:" prop="spareKeyNum">
							<el-input
								maxlength="50"
								v-model="form.spareKeyNum"
								clearable
								placeholder="请输入备用钥匙数量"></el-input>
						</el-form-item>
					</el-col>

					<!--                    <el-col :span="8">-->
					<!--                        <el-form-item label="车辆状态:" prop="businessType">-->
					<!--                            <el-select filterable v-model="form.businessType" clearable style="width: 100%">-->
					<!--                                <template v-for="dict in dict.type.car_business_type">-->
					<!--                                    <el-option :label="dict.label" :value="dict.value" :key="dict.value"></el-option>-->
					<!--                                </template>-->
					<!--                            </el-select>-->
					<!--                        </el-form-item>-->
					<!--                    </el-col>-->

					<el-col :span="8">
						<el-form-item
							label="进口车/国产车:"
							prop="domesticImported">
							<el-select
								filterable
								v-model="form.domesticImported"
								clearable
								style="width: 100%">
								<template
									v-for="dict in dict.type.domestic_imported">
									<el-option
										:label="dict.label"
										:value="dict.value"
										:key="dict.value"></el-option>
								</template>
							</el-select>
						</el-form-item>
					</el-col>

					<el-col :span="8">
						<el-form-item label="车辆产权:" prop="propertyRightId">
							<el-select
								filterable
								@change="propertyChange"
								v-model="form.propertyRightId"
								clearable
								:disabled="2 == form.purchaseSource"
								style="width: 100%">
								<template
									v-for="(item, index) in companyOriginList">
									<el-option
										:label="item.deptName"
										:value="item.deptId"
										:key="index"></el-option>
								</template>
							</el-select>
						</el-form-item>
					</el-col>

					<el-col :span="8">
						<el-form-item label="车辆归属:" prop="ascriptionId">
							<el-select
								filterable
								@change="belongChange"
								v-model="form.ascriptionId"
								clearable
								:disabled="2 == form.purchaseSource"
								style="width: 100%">
								<template
									v-for="(item, index) in belongCompanyList">
									<el-option
										:label="item.deptName"
										:value="item.deptId"
										:key="index"></el-option>
								</template>
							</el-select>
						</el-form-item>
					</el-col>

					<el-col :span="8">
						<el-form-item label="车辆大区:" prop="cityId">
							<RegionCityLink
								v-model="form.citydata"
								:key="carKey"
								:disabled="2 == form.purchaseSource"
								placeholder="请选择城市"
								ref="citySelect"
								:showAllLevels="false"
								:defaultSelect="selIds"
								@change="citySelectionChange"></RegionCityLink>

							<!--                            <el-input v-model="form.region" clearable placeholder="请输入车辆大区"></el-input>-->
						</el-form-item>
					</el-col>

					<el-col :span="8">
						<el-form-item label="车辆运营:" prop="operationsName">
							<el-input
								maxlength="50"
								v-model="form.operationsName"
								clearable
								:disabled="2 == form.purchaseSource"
								placeholder="请输入车辆运营"></el-input>
						</el-form-item>
					</el-col>

					<el-col :span="24">
						<el-form-item
							label="备注:"
							prop="remark"
							style="height: 80px">
							<el-input
								maxlength="500"
								type="textarea"
								v-model="form.remark"
								clearable
								placeholder="请输入备注"></el-input>
						</el-form-item>
					</el-col>

					<el-col :span="24">
						<el-form-item label="附件上传:" prop="attachmentOss">
							<ImageCommon
								:up-type="2"
								info="选择附件"
								:limit="9"
								v-model="form.attachmentOss"></ImageCommon>
						</el-form-item>
					</el-col>
				</el-row>
			</el-form>
		</div>

		<div class="card-wrap flex justify-end card-padding">
			<el-button @click="cancel">取消</el-button>
			<el-button
				:loading="buttonLoading"
				type="primary"
				@click="submitForm">
				保存
			</el-button>
		</div>

		<el-dialog title="选择组织" :visible.sync="dialogVisible" width="35%">
			<div class="head-container">
				<el-tree
					:data="deptOptions"
					:props="defaultProps"
					:expand-on-click-node="false"
					:filter-node-method="filterNode"
					ref="tree"
					node-key="id"
					default-expand-all
					highlight-current
					@node-click="handleNodeClick" />
			</div>
		</el-dialog>
	</div>
</template>

<script>
	import LinkageSelect from '@/views/components/linkageSelect.vue';
	import { deptTreeSelect, listUser } from '@/api/system/user';
	import {
		qualifiedCardAdd,
		qualifiedCardUpdate,
		qualifiedCardDetail,
		qualifiedCardRecog,
	} from '@/api/purchaseManage/certificateList';
	import { listDept } from '@/api/system/dept';
	import RegionCityLink from '@/views/components/provinceCity/regionCityLink.vue';
	import { recognitionModel } from '@/api/purchaseManage/purchaseList';
	import LinkageSelect2 from '@/views/components/linkageSelect2.vue';
	import ModelSelect from '@/views/components/modelSelect.vue';

	export default {
		name: 'CertificateAdd',
		components: {
			ModelSelect,
			LinkageSelect2,
			RegionCityLink,
			LinkageSelect,
		},
		dicts: [
			'car_business_type',
			'car_nature',
			'domestic_imported',
			'fuel_type',
			'car_type',
		],
		data() {
			return {
				buttonLoading: false,
				form: {
					followerIds: null,
				},
				modelKey: 0,
				carKey: 0,
				dialogVisible: false,
				deptOptions: null,
				defaultProps: {
					children: 'children',
					label: 'label',
				},
				deptId: null,
				deptLabel: null,
				userList: [],
				rules: {
					qualifiedCardOss: [
						{
							required: true,
							message: '请上传合格证',
							trigger: 'change',
						},
					],
					qualifiedNo: [
						{
							required: true,
							message: '请输入合格证编码',
							trigger: 'blur',
						},
					],
					vinNo: [
						{
							required: true,
							message: '请输入车架号',
							trigger: 'blur',
						},
            { pattern:  /^[A-HJ-NPR-Z0-9]{17}$/, message: '车架号为17位，大写字母及数字组成，不包含IOQ', trigger: 'blur' }
					],
					engineNo: [
						{
							required: true,
							message: '请输入发动机号码',
							trigger: 'blur',
						},
					],
					// carType: [
					//     {
					//         required: true,
					//         message: '请输入车辆类型',
					//         trigger: 'blur'
					//     }
					// ],
					// vehicleCategory: [
					//     {
					//         required: true,
					//         message: '请输入车辆种类',
					//         trigger: 'blur'
					//     }
					// ],
					modelId: [
						{
							required: true,
							message: '请输入车辆品牌/车系/车型',
							trigger: 'blur',
						},
					],
					// styleYear: [
					//     {
					//         required: true,
					//         message: '请输入年款',
					//         trigger: 'blur'
					//     }
					// ],
					// config: [
					//     {
					//         required: true,
					//         message: '请输入配置',
					//         trigger: 'blur'
					//     }
					// ],
					// gearPosition: [
					//     {
					//         required: true,
					//         message: '请输入档位',
					//         trigger: 'blur'
					//     }
					// ],
					seatNum: [
						{
							required: true,
							message: '请输入座位数',
							trigger: 'blur',
						},
					],
					fuelType: [
						{
							required: true,
							message: '请输入燃油类型',
							trigger: 'blur',
						},
					],
					// liter: [
					//     {
					//         required: true,
					//         message: '请输入排量',
					//         trigger: 'blur'
					//     }
					// ],
					// environmentalStandards: [
					//     {
					//         required: true,
					//         message: '请输入环保标准',
					//         trigger: 'blur'
					//     }
					// ],
					exteriorColor: [
						{
							required: true,
							message: '请输入外观颜色',
							trigger: 'blur',
						},
					],
					interiorColor: [
						{
							required: true,
							message: '请输入内饰颜色',
							trigger: 'blur',
						},
					],
					// businessType: [
					//     {
					//         required: true,
					//         message: '请输入车辆状态',
					//         trigger: 'blur'
					//     }
					// ],
					issuanceDate: [
						{
							required: true,
							message: '请选择发证日期',
							trigger: 'change',
						},
					],
					domesticImported: [
						{
							required: true,
							message: '请选择国产车/进口车',
							trigger: 'change',
						},
					],
					// carAccompanying: [
					//     {
					//         required: true,
					//         message: '请输入车辆随车物品',
					//         trigger: 'blur'
					//     }
					// ],
					// spareKeyNum: [
					//     {
					//         required: true,
					//         message: '请输入备用钥匙数量',
					//         trigger: 'blur'
					//     }
					// ],
					// carLevel: [
					//     {
					//         required: true,
					//         message: '请输入车辆级别',
					//         trigger: 'blur'
					//     }
					// ],
				},
				companyOriginList: [],
				belongCompanyList: [],
				selIds: [],
			};
		},
		watch: {
			$route: {
				handler(val) {
					// console.log('this.$route', this.$route);

					if (val && val.name == this.$options.name) {
						if (
							this.$route.query &&
							this.$route.query.qualifiedCardId &&
							!this.$route.query.tabClick
						) {
							this.getOldData(this.$route.query.qualifiedCardId);
						} else if (!this.$route.query.tabClick) {
							this.form = {
								followerIds: null,
							};
						}
						const title = this.$route?.query?.pageType ?? '合格证';
						const route = Object.assign({}, this.$route, {
							title: `${title}`,
						});
						this.$store.dispatch(
							'tagsView/updateVisitedView',
							route,
						);
						this.getCompanyOrigin();
					}
				},
				immediate: true,
				deep: true,
			},
		},
		methods: {
			citySelectionChange(val) {
				if (val.length > 0) {
					this.form.region = val[0].pathNodes[0].label;
					this.form.regionId = val[0].pathNodes[0].value;
					this.form.provinceName = val[0].pathNodes[1].label;
					this.form.provinceId = val[0].pathNodes[1].value;
					this.form.cityName = val[0].pathNodes[2].label;
					this.form.cityId = val[0].pathNodes[2].value;
				} else {
					this.form.regionId = null;
					this.form.region = null;
					this.form.provinceName = null;
					this.form.provinceId = null;
					this.form.cityId = null;
					this.form.cityName = null;
				}

				let find = this.belongCompanyList.find(
					item => this.form.ascriptionId == item.deptId,
				);

				if (
					this.form.cityId &&
					find &&
					this.form.cityId != find.regionId.split('/')[1]
				) {
					this.form.ascription = null;
					this.form.ascriptionId = null;
				}

				this.belongCompanyList = [];
				this.getBelongCompany();
			},

			//归属
			belongChange(val) {
				let find = this.belongCompanyList.find(
					item => val == item.deptId,
				);
				if (find) {
					this.form.ascription = find.deptName ?? null;
					console.log('belongChange', find);

					this.selIds = [
						find.areaId,
						find.regionId && find.regionId.split('/')[0],
						find.regionId && find.regionId.split('/')[1],
					];
				} else {
					this.selIds = [];
				}
			},

			//产权
			propertyChange(val) {
				this.form.propertyRightName =
					this.companyOriginList.find(item => val == item.deptId)
						?.deptName ?? null;
				console.log('propertyChange', this.form.propertyRightName);
			},

			getCompanyOrigin() {
				listDept({
					deptType: '2', //组织类型（1部门 2公司）
					regionId: null, //所在城市（省市区id）
				}).then(res => {
					this.companyOriginList = res.data;
					this.belongCompanyList = res.data;
				});
			},

			getBelongCompany() {
				listDept({
					deptType: '2', //组织类型（1部门 2公司）
					regionId: this.form.cityId, //所在城市（省市区id）
				}).then(res => {
					this.belongCompanyList = res.data;
				});
			},

			imageChange(url) {
				console.log('图片变化了', url);
				let that = this;
				if (url) {
					this.buttonLoading = true;
					qualifiedCardRecog(this.form.qualifiedCardOss)
						.then(res => {
							if (res.code == '200') {
								let writeArr = [
									'carNature', //车辆性质:
									'modeldata', //品牌车系:
									'purchaseSource', //车型:
									'gearPosition', //档位:
									'seatNum', //座位数:
									'fuelType', //燃油类型:
									'liter', //排量:
									'environmentalStandards', //环保标准:
									'propertyRightId', //车辆产权:
									'ascriptionId', //车辆归属:
									'citydata', //车辆大区:
									'operationsName', //车辆运营:
								];
								for (const dataKey in res.data) {
									if (
										res.data[dataKey] != undefined &&
										res.data[dataKey] != null &&
										res.data[dataKey] != ''
									) {
										if (
											that.form.purchaseSource == 2 &&
											writeArr.includes(dataKey)
										) {
											continue;
										}
										// that.form[dataKey] = res.data[dataKey]
										that.$set(
											that.form,
											dataKey,
											res.data[dataKey],
										);
									}
								}
								that.$forceUpdate();
							} else {
								// that.form.qualifiedCardOss = null;
							}

							// that.form.modeldata = []
							// if (that.form.modelId && that.form.modelId != null) {
							//     //下标0为一级菜单value
							//     that.form.modeldata[0] = String(that.form.brandId);
							//     //下标1为二级菜单value
							//     that.form.modeldata[1] = String(that.form.seriesId);
							//     //下标1为三级菜单value
							//     that.form.modeldata[2] = String(that.form.modelId);
							//     that.modelKey++
							//     console.log('--', that.form.modeldata)
							// }
						})
						.catch(e => {
							// that.form.qualifiedCardOss = null;
						})
						.finally(f => {
							this.buttonLoading = false;
						});
				}
			},

			modeSel(val) {
				if (val && val.modelId) {
					this.$set(this.form, 'brandId', val.brandId);
					this.$set(this.form, 'seriesId', val.seriesId);
					this.$set(this.form, 'brandName', val.brandName);
					this.$set(this.form, 'seriesName', val.seriesName);

					this.$set(this.form, 'modelId', val.modelId);
					this.$set(this.form, 'modelName', val.modelName);

					this.form.modeldata[0] = String(this.form.brandId);
					//下标1为二级菜单value
					this.form.modeldata[1] = String(this.form.seriesId);
					//下标1为三级菜单value
					// fitem.modeldata[2] = fitem.modelId;
					this.modelKey++;
				} else {
					this.form.modelId = null;
					this.form.modelName = null;
				}

				this.getSeatList();
				this.$forceUpdate();
				this.$refs.form.validateField(['seriesId', 'modelId']);
				this.$nextTick(() => {
					this.$refs.form.validateField(['seriesId', 'modelId']);
				});
			},

			async linkageChange(val) {
				if (val && val[1] && val[1].id) {
					this.$set(this.form, 'brandId', val[0].id);
					this.$set(this.form, 'seriesId', val[1].id);
					this.$set(this.form, 'brandName', val[0].name);
					this.$set(this.form, 'seriesName', val[1].name);
				} else {
					this.$set(this.form, 'brandId', null);
					this.$set(this.form, 'seriesId', null);
					this.$set(this.form, 'brandName', null);
					this.$set(this.form, 'seriesName', null);
				}
				this.$set(this.form, 'modelId', null);
				this.$set(this.form, 'modelName', null);

				this.$forceUpdate();
				this.$refs.form.validateField(['seriesId', 'modelId']);
				this.$nextTick(() => {
					this.$refs.form.validateField(['seriesId', 'modelId']);
				});
			},

			// linkageChange(val) {
			//     console.log('val---fitem', val)
			//     if (val) {
			//         this.form.brandId = val[0] ? val[0].id : ''
			//         this.form.seriesId = val[1] ? val[1].id : ''
			//         this.form.modelId = val[2] ? val[2].id : ''
			//         this.form.brandName = val[0] ? val[0].name : ''
			//         this.form.seriesName = val[1] ? val[1].name : ''
			//         this.form.modelName = val[2] ? val[2].name : ''
			//     } else {
			//         this.form.brandId = null
			//         this.form.seriesId = null
			//         this.form.modelId = null
			//         this.form.brandName = null
			//         this.form.seriesName = null
			//         this.form.modelName = null
			//     }
			//     this.getSeatList()
			//     this.$forceUpdate()
			// },

			getSeatList() {
				if (
					this.form.modelId == undefined ||
					this.form.modelId == null ||
					this.form.modelId == ''
				) {
					return;
				}
				let that = this;

				recognitionModel(this.form.modelId).then(res => {
					if (res.code == '200') {
						for (const dataKey in res.data) {
							if (
								res.data[dataKey] != undefined &&
								res.data[dataKey] != null &&
								res.data[dataKey] != ''
							) {
								// this.form[dataKey] = res.data[dataKey]
								that.$set(
									that.form,
									dataKey,
									res.data[dataKey],
								);
							}
						}
					}

					// that.$nextTick(() => {
					that.$forceUpdate();
					// })
				});
			},

			cancel() {
				this.$router.back();
				this.$store.dispatch('tagsView/delView', this.$route);
			},
			submitForm() {
				let that = this;

				this.$refs['form'].validate(valid => {
					if (valid) {
						this.buttonLoading = true;

						if (that.form.qualifiedCardId) {
							qualifiedCardUpdate(that.form)
								.then(res => {
									this.buttonLoading = false;
									this.$modal.msgSuccess('提交成功');
									this.$router.back();
									this.$store.dispatch(
										'tagsView/delView',
										this.$route,
									);
								})
								.finally(e => {
									this.buttonLoading = false;
								});
						}
						// else {
						//     qualifiedCardAdd(that.form).then(res => {
						//         this.buttonLoading = false;
						//         this.$modal.msgSuccess("提交成功");
						//         this.$router.back();
						//         this.$store.dispatch('tagsView/delView', this.$route);
						//     }).finally(e => {
						//         this.buttonLoading = false;
						//     })
						// }
					}
				});
			},
			getOldData(qualifiedCardId) {
				qualifiedCardDetail(qualifiedCardId).then(res => {
					this.form = res.data;

					this.form.modeldata = [];
					if (this.form.modelId && this.form.modelId != null) {
						//下标0为一级菜单value
						this.form.modeldata[0] = String(this.form.brandId);
						//下标1为二级菜单value
						this.form.modeldata[1] = String(this.form.seriesId);
						//下标1为三级菜单value
						// this.form.modeldata[2] = String(this.form.modelId);
						console.log('--', this.form.modeldata);
						this.modelKey++;
					}

					this.form.citydata = [];
					if (this.form.cityId && this.form.cityId != null) {
						//下标0为一级菜单value
						this.form.citydata[0] = String(this.form.regionId);
						//下标1为二级菜单value
						this.form.citydata[1] = String(this.form.provinceId);
						this.form.citydata[2] = String(this.form.cityId);
						console.log('citydata--', this.form.citydata);
						this.carKey++;
					}

					this.$forceUpdate();
				});
			},
			// 筛选节点
			filterNode(value, data) {
				if (!value) return true;
				return data.label.indexOf(value) !== -1;
			},
			/** 查询组织下拉树结构 */
			getDeptTree() {
				deptTreeSelect().then(response => {
					this.deptOptions = response.data;
				});
			},
			// 节点单击事件
			handleNodeClick(data) {
				console.log('data', data);

				this.deptLabel = data.label;
				this.deptId = data.id;
				this.form.followerIds = null;

				this.dialogVisible = false;

				this.getUserList();
			},
			getUserList() {
				listUser({
					pageNum: 1,
					pageSize: 100000,
					deptId: this.deptId,
				}).then(response => {
					this.userList = response.rows;
					// this.total = response.total;
					// this.loading = false;
				});
			},
			deptClick() {
				this.dialogVisible = true;
				this.$refs.deptselect.blur();
			},
		},
	};
</script>

<style lang="scss" scoped>
	.el-form-item {
		margin-bottom: 13px !important;
		width: 100% !important;
	}

	::v-deep .el-form--label-top .el-form-item__label {
		padding: 0;
	}

	.el-form-item {
		margin-bottom: 15px;
		width: 70%;
	}
</style>
